<template>
  <div>
    <Row>
      <Card>
        <Row>
          <i-col :xs="24" :md="24" :lg="12">
            <Row style="margin-bottom:20px">
              <h2>正向激励详细情况</h2>
            </Row>

            <Row>
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary">事项名称</Tag>
                <span>{{incentiveItem.incentive}}</span>
              </i-col>
            </Row>
            <Row style="margin-top:20px">
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary">表彰单位</Tag>
                <span>{{incentiveItem.recognitionUnit}}</span>
              </i-col>
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary">被表彰单位</Tag>
                <span>{{incentiveItem.commendedUnit}}</span>
              </i-col>
            </Row>
            <Row style="margin-top:20px">
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary">加分分值</Tag>
                <span>{{incentiveItem.point}}</span>
              </i-col>
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary">年份</Tag>
                <span>{{incentiveItem.dateTime}}</span>
              </i-col>
            </Row>
            <Row style="margin-top:20px">
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary">证明材料名称</Tag>
                <span>{{incentiveItem.fileName}}</span>
              </i-col>
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary"></Tag>
                <Button type="success" @click="downloadWordFile">下载附件</Button>
              </i-col>
            </Row>
            <Row style="margin-top:20px">
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary">加分类别</Tag>
                <span>{{incentiveItem.typeClass}}</span>
              </i-col>
              <i-col :xs="24" :md="12" :lg="12">
                <Tag type="dot" color="primary">审核状态</Tag>
                <span>{{incentiveItem.audit | auditState}}</span>
              </i-col>
            </Row>
            <Row style="margin-top:20px">
              <i-col :xs="24">
                <Tag type="dot" color="primary">类别名称</Tag>
                <span>{{incentiveItem.typeName}}</span>
              </i-col>
            </Row>
            <Row style="margin-top:20px">
              <i-col :xs="24">
                <Tag type="dot" color="primary">具体类别</Tag>
                <span>{{incentiveItem.itemName}}</span>
              </i-col>
            </Row>
            <Row v-if="isSpuerAdmins.add" style="margin:20px 0">
              <i-col :xs="24" :md="12" :lg="24">
                <Tag type="dot" color="error">回退原因</Tag>
                <Input
                  v-model="reason"
                  type="textarea"
                  style="z-index:10;padding:10px 20px 0 0"
                  :rows="3"
                  placeholder="如果进行回退操作。请说明回退原因"
                />
              </i-col>
            </Row>
          </i-col>
          <i-col :xs="24" :md="24" :lg="12">
            <Row>
              <i-col :xs="24" :md="24" :lg="24">
                <Carousel v-model="value2" style="height:500px;width:100%;">
                  <CarouselItem v-for="(item ,index) in incentiveItem.fileList" :key="index">
                    <div class="demo-carousel">
                      <img class="demo-img" :src="HOST+item.url" width="100%" height="auto" />
                    </div>
                  </CarouselItem>
                </Carousel>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </Card>
    </Row>
    <Row style="margin-top:20px" v-if="isSpuerAdmins.add">
      <Card>
        <Button type="success" :loading="isAuditLoading" @click="submitAudit">审核通过</Button>
        <Button
          type="error"
          :loading="isReasonLoading"
          @click="submitReason"
          style="margin-left:10px"
        >回退</Button>
      </Card>
    </Row>
  </div>
</template>
<script>
import { incentiveAjax } from "@/api/city";
import { HOST, URL } from "@/libs/util";
// 以防命名冲突
const HOSTS = URL;
export default {
  data() {
    return {
      // 增删改查权限按钮
      btnAccess: {
        add: true,
        add2: "inline-block",
        del: "inline-block",
        upd: true,
        query: true
      },
      // 是否为超级管理员
      isSpuerAdmins: {
        add: true,
        action: "inline-block"
      },
      value2: 0, // 轮播的起始播放
      isAuditLoading: false, // 提交通过LOADING
      isReasonLoading: false, // 退回通过LOADING
      incentiveItem: "", // 事项数据
      audit: false, // 是否
      reason: "", // 回退原因
      HOST: "", // http//192.....
      otherFileId: "" // 附件id
    };
  },
  methods: {
    submitAudit() {
      this.isAuditLoading = true;
      const url = "/incentive/pass";
      this._incentiveAjax(url, this.incentiveItem);
    },
    submitReason() {
      if (this.reason === "") {
        this.$Message.error("请填写回退原因");
        retrun;
      }
      this.incentiveItem = Object.assign(this.incentiveItem, {
        reason: this.reason
      });
      this.isReasonLoading = true;
      const url = "/incentive/noPass";
      this._incentiveAjax(url, this.incentiveItem);
    },
    // AJAX
    _incentiveAjax(url, formData, pageSize, pageNumber) {
      formData = Object.assign(formData, {
        pageSize,
        pageNumber
      });
      const keyOne = "incentiveEntity";
      const keyTwo = "";
      incentiveAjax({ url, formData, keyOne, keyTwo })
        .then(result => {
          if (result.data.code === "200") {
            this.$Message.success("操作成功");
            this.isAuditLoading = false;
            this.isReasonLoading = false;
          } else {
            this.$Message.error("操作失败");
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    // 下载附件
    downloadWordFile() {
      window.open(HOSTS + "/upload/downloadFile?id=" + this.otherFileId);
    }
  },
  filters: {
    auditState(value) {
      var text = "";
      switch (value) {
        case "0":
          text = "未审核";
          break;
        case "1":
          text = "已审核";
          break;
        case "2":
          text = "回退";
          break;
        default:
          break;
      }
      return text;
    }
  },
  created() {
    this.HOST = HOST;
    var param = this.$route.params;

    this.otherFileId = this.$route.params.incentiveItem.otherFileId;
    console.log(this.otherFileId);
    this.incentiveItem = param.incentiveItem;
    this.audit = param.audit;
    this.reason = param.incentiveItem.reason;

    // // 全局判断按钮权限
    // this.globalBtnAccess();
    // 获取是否为超级管理员
    let isSuperAdmin = sessionStorage.getItem("isSuperAdmin");
    this.globalFunction2(isSuperAdmin);
  }
};
</script>
<style>
.demo-img {
  height: 100%;
}
.ivu-carousel-list {
  height: 500px;
}
.ivu-carousel-track {
  height: 500px;
}
.ivu-carousel-item {
  height: 500px;
}
.demo-carousel {
  height: 500px;
}
</style>
